feat(FR-2611): retire Craco/Webpack — build, Makefile, CI all on Vite/Vitest by nowgnuesLee · Pull Request #6876 · lablup/backend.ai-webui

nowgnuesLee · 2026-04-22T05:30:00Z

Summary

With vite build proven in FR-2608 and Vitest landed across all three workspaces (FR-2609 + follow-up), this PR retires the Craco/Webpack build pipeline entirely. -772 lines / +62 lines.

Build

react/package.json:
- start: craco start → vite
- build:only: craco build → vite build
- test: jest → vitest run

Makefile

dep target's probe pattern updated from es6://static/js/main (CRA/webpack chunk layout) to es6://assets/index- (Vite output layout, proven in FR-2607).

CI

Renames .github/workflows/jest.yml → vitest.yml.
Replaces the Jest coverage action with plain pnpm run vitest across three jobs: react-vitest, backend-ai-ui-vitest, root-vitest.
NOTE: branch-protection rules that reference the old job names (react-coverage, backend-ai-ui-coverage) must be updated to the new names, otherwise the vitest check won't be a required status.

Dep cleanup (`react/package.json`)

Removed:

@craco/craco, react-scripts, babel-preset-react-app, react-dev-utils, html-webpack-plugin, workbox-webpack-plugin
babel-jest, webpack, baseline-browser-mapping, caniuse-lite, prop-types, stream-browserify, identity-obj-proxy
jest, jest-canvas-mock, jest-environment-jsdom

Also removed the react-scripts@5.0.1 patched-dependency entry from pnpm-workspace.yaml and its .patch file, and deleted react/craco.config.cjs, react/babel.config.cjs, react/src/react-app-env.d.ts, and the empty react/public/.

Verification

pnpm run build:only in react/ produces build/index.html + build/assets/*
Electron build: BUILD_TARGET=electron pnpm run vite:build emits es6://assets/index-* URLs
make dep completes end-to-end, packages Electron app from the new build layout
All three Vitest suites green (856 + 315 + 90)
Lint + format clean across all three workspaces

Stack

Builds on the Vitest follow-up. Additional runtime bug-fix PRs (manifest, global, webpackIgnore) stacked on top of this one.

nowgnuesLee · 2026-04-22T05:30:13Z

fix(FR-2529): include backend.ai-client src in craco TS loader and tsconfig paths #6615
refactor(FR-2529): extract backend.ai-client as standalone workspace package #6614
fix(FR-2607): align Electron publicPath patch with Vite output #7189
fix(FR-2606): clear residual build-time warnings (BUI dts + module directive) #7113
fix(FR-2606): restore Monaco self-hosting in Vite dev server #7104
feat(FR-2748): fully migrate test files from jest.* to vi.* and align TS globals #7083
feat(FR-2746): re-enable 5 tests skipped during Vitest migration #7071
feat(FR-2744): restore Vitest coverage reporting in CI #7065
fix(FR-2606): replace webpackIgnore with @vite-ignore in dynamic plugin imports #6879
fix(FR-2606): replace global.packageVersion with globalThis.packageVersion in WebUISider #6878
fix(FR-2608): disable vite-plugin-pwa auto-manifest to preserve existing manifest.json #6877
feat(FR-2611): retire Craco/Webpack — build, Makefile, CI all on Vite/Vitest #6876 👈 (View in Graphite)
feat: migrate BUI + root tests from Jest to Vitest (follow-up to FR-2609) #6875
feat(FR-2609): Vitest migration for react/ (100% pass, 856/856 tests) #6874
feat(FR-2608): Vite production build with vite-plugin-pwa service worker #6873
feat(FR-2610): Vite dev-reload plugin for i18n / theme / config.toml file changes #6872
feat(FR-2607): Vite spike answer — es6:// Electron publicPath works via renderBuiltUrl #6871
feat(FR-2606): restore BUI i18n context isolation under Vite dep optimization #6870
feat(FR-2606): Vite PoC phase 1 — dev server + HMR + React Compiler parity #6869
main

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

flow:merge-queue - adds this PR to the back of the merge queue
flow:hotfix - for urgent changes, fast-track this PR to the front of the merge queue

You must have a Graphite account in order to use the merge queue. Sign up using this link.

_{An organization admin has required the Graphite Merge Queue in this repository.} _{Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.}

This stack of pull requests is managed by Graphite. Learn more about stacking.

Copilot

Pull request overview

Retires the Craco/Webpack + Jest pipeline and switches the repo’s React workspace and CI testing to Vite + Vitest.

Changes:

Update react/ scripts to use vite/vite build and vitest run.
Remove CRA/Craco configuration and the react-scripts@5.0.1 pnpm patch entry.
Replace the Jest coverage workflow with a multi-workspace Vitest workflow (react, backend.ai-ui, root).

Reviewed changes

Copilot reviewed 6 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
`react/src/react-app-env.d.ts`	Deleted CRA-era ambient typings (needs a Vite-era replacement for still-used globals/types).
`react/patches/react-scripts@5.0.1.patch`	Removed no-longer-needed `react-scripts` patch file.
`react/package.json`	Switch scripts to Vite/Vitest; devDependencies partially cleaned up.
`react/craco.config.cjs`	Deleted Craco/Webpack configuration.
`react/babel.config.cjs`	Deleted CRA/Jest-era Babel configuration.
`pnpm-workspace.yaml`	Removed `react-scripts@5.0.1` patched dependency entry.
`.github/workflows/vitest.yml`	New Vitest-based CI workflow with per-workspace jobs.

Comments suppressed due to low confidence (3)

.github/workflows/vitest.yml:14

The workflow trigger/path filters don’t include react/vite.config.ts. Since this PR migrates the build pipeline to Vite and that file materially affects dev/build behavior, changes to it would currently bypass this workflow entirely (no check-changes job, no Vitest). Please add react/vite.config.ts to both on.pull_request.paths and the paths-filter rules so CI runs when Vite config changes.
.github/workflows/vitest.yml:56
react-vitest still runs jwalton/gh-find-current-pr@v1 (step id: findPr), but the PR number output is no longer used after removing the Jest coverage report action. Removing this step will speed up CI a bit and avoids an unnecessary external action dependency.
.github/workflows/vitest.yml:136
root-vitest uses actions/checkout@v4 and pnpm/action-setup@v4 while the other jobs use @v5. Aligning these to the same major versions across jobs reduces maintenance overhead and avoids subtle behavior differences between jobs.

graphite-app · 2026-04-30T12:11:53Z

Merge activity

Apr 30, 12:11 PM UTC: yomybaby added this pull request to the Graphite merge queue.
Apr 30, 12:31 PM UTC: Merged by the Graphite merge queue.

…/Vitest (#6876) Resolves #6814(FR-2611) ## Summary With `vite build` proven in FR-2608 and Vitest landed across all three workspaces (FR-2609 + follow-up), this PR retires the Craco/Webpack build pipeline entirely. **-772 lines / +62 lines.** ### Build - `react/package.json`: - `start`: `craco start` → `vite` - `build:only`: `craco build` → `vite build` - `test`: `jest` → `vitest run` ### Makefile - `dep` target's probe pattern updated from `es6://static/js/main` (CRA/webpack chunk layout) to `es6://assets/index-` (Vite output layout, proven in FR-2607). ### CI - Renames `.github/workflows/jest.yml` → `vitest.yml`. - Replaces the Jest coverage action with plain `pnpm run vitest` across three jobs: `react-vitest`, `backend-ai-ui-vitest`, `root-vitest`. - **NOTE**: branch-protection rules that reference the old job names (`react-coverage`, `backend-ai-ui-coverage`) must be updated to the new names, otherwise the vitest check won't be a required status. ### Dep cleanup (`react/package.json`) Removed: - `@craco/craco`, `react-scripts`, `babel-preset-react-app`, `react-dev-utils`, `html-webpack-plugin`, `workbox-webpack-plugin` - `babel-jest`, `webpack`, `baseline-browser-mapping`, `caniuse-lite`, `prop-types`, `stream-browserify`, `identity-obj-proxy` - `jest`, `jest-canvas-mock`, `jest-environment-jsdom` Also removed the `react-scripts@5.0.1` patched-dependency entry from `pnpm-workspace.yaml` and its `.patch` file, and deleted `react/craco.config.cjs`, `react/babel.config.cjs`, `react/src/react-app-env.d.ts`, and the empty `react/public/`. ## Verification - [x] `pnpm run build:only` in `react/` produces `build/index.html` + `build/assets/*` - [x] Electron build: `BUILD_TARGET=electron pnpm run vite:build` emits `es6://assets/index-*` URLs - [x] `make dep` completes end-to-end, packages Electron app from the new build layout - [x] All three Vitest suites green (856 + 315 + 90) - [x] Lint + format clean across all three workspaces ## Stack Builds on the Vitest follow-up. Additional runtime bug-fix PRs (manifest, global, webpackIgnore) stacked on top of this one.

Resolves #6809(FR-2606) ## Summary Dev-server regression noticed after the Vite cutover: pages that mount a Monaco editor break at mount time because the `/resources/monaco/vs/*` URL prefix no longer resolves on the dev server. `@monaco-editor/react` loads the Monaco AMD runtime at runtime via: ```ts loader.config({ paths: { vs: '/resources/monaco/vs' } }); ``` (see `react/src/helper/monacoEditor.ts`). The self-hosted prefix exists so the editor works in offline / air-gapped deployments where jsDelivr is unreachable. Pre-Vite, the dev-server side of this contract was the `static` directory list in `react/craco.config.cjs` (lines 44–60 of the now-deleted file): it served `react/node_modules/monaco-editor/min/vs/*` at the `/resources/monaco/vs` URL prefix. Production builds copy the same tree to `build/web/resources/monaco/vs/` via the root `copymonaco` script (`package.json:32`). After #6876 (FR-2611) dropped `craco.config.cjs`, the production `copymonaco` step was preserved but the dev-server-side mapping was not ported to `vite.config.ts`. As a result, in `pnpm run dev`, requests to `/resources/monaco/vs/loader.js` 404 and any page that mounts a Monaco editor breaks. **Fix**: add `monacoStaticPlugin()` to `react/vite.config.ts` mirroring the deleted craco `static` entry. - Serves `/resources/monaco/vs/*` from `react/node_modules/monaco-editor/min/vs/*`. - `apply: 'serve'` — dev-only; production is unchanged because `copymonaco` already populates `build/web/resources/monaco/vs/`. - Path-traversal guard via `filePath.startsWith(monacoRoot)` after `join` normalization. - Registered in the `plugins` array before `projectRootStaticPlugin()` so the narrower Monaco prefix is matched first. ## Verification - [x] `bash scripts/verify.sh` — Relay / Lint / Format / TypeScript all PASS - [ ] `pnpm run dev`, navigate to a Monaco-mounting page (manifest editor on Environments page) — editor renders without console errors, no `cdn.jsdelivr.net` fetches - [ ] DevTools → Network: `/resources/monaco/vs/loader.js`, `/resources/monaco/vs/editor/editor.main.js` return 200 from the dev server ## Stack Top of the Vite migration follow-up stack. Sits on top of #7083 (FR-2748).

github-actions Bot assigned nowgnuesLee Apr 22, 2026

github-actions Bot added the size:XL 500~ LoC label Apr 22, 2026

nowgnuesLee force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch from ace1b59 to 818d02a Compare April 27, 2026 13:57

nowgnuesLee force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch from 0bcadfc to 0c5139e Compare April 27, 2026 13:57

This was referenced Apr 27, 2026

fix(FR-2606): restore Monaco self-hosting in Vite dev server #7104

Merged

fix(FR-2606): clear residual build-time warnings (BUI dts + module directive) #7113

Merged

nowgnuesLee marked this pull request as ready for review April 28, 2026 04:25

Copilot AI review requested due to automatic review settings April 28, 2026 04:25

Copilot started reviewing on behalf of nowgnuesLee April 28, 2026 04:25 View session

Copilot AI reviewed Apr 28, 2026

View reviewed changes

Comment thread react/package.json

Comment thread react/package.json

nowgnuesLee force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch from 0c5139e to 560dea4 Compare April 28, 2026 05:02

nowgnuesLee force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch 2 times, most recently from 6c1b86d to 7f03080 Compare April 28, 2026 05:15

nowgnuesLee force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch 3 times, most recently from a68b158 to ff24662 Compare April 28, 2026 05:25

nowgnuesLee force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch from 027a403 to 1f59ad5 Compare April 28, 2026 05:25

nowgnuesLee force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch from ff24662 to ed450f5 Compare April 28, 2026 05:28

nowgnuesLee force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch from 1f59ad5 to d578ec5 Compare April 28, 2026 05:28

yomybaby mentioned this pull request Apr 30, 2026

fix(FR-2607): align Electron publicPath patch with Vite output #7189

Merged

yomybaby force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch from d578ec5 to 5fc6577 Compare April 30, 2026 12:08

yomybaby force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch from ed450f5 to 07e96d8 Compare April 30, 2026 12:08

This was referenced Apr 30, 2026

refactor(FR-2529): extract backend.ai-client as standalone workspace package #6614

Merged

fix(FR-2529): include backend.ai-client src in craco TS loader and tsconfig paths #6615

Closed

graphite-app Bot force-pushed the 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ branch from 5fc6577 to b598d84 Compare April 30, 2026 12:16

graphite-app Bot force-pushed the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch from 07e96d8 to eaec713 Compare April 30, 2026 12:16

Base automatically changed from 04-21-feat_migrate_bui_root_tests_from_jest_to_vitest_follow-up_to_fr-2609_ to main April 30, 2026 12:30

graphite-app Bot merged commit eaec713 into main Apr 30, 2026
7 of 8 checks passed

graphite-app Bot deleted the 04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest branch April 30, 2026 12:31

github-pages Bot temporarily deployed to github-pages April 30, 2026 12:32 Inactive

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(FR-2611): retire Craco/Webpack — build, Makefile, CI all on Vite/Vitest#6876

feat(FR-2611): retire Craco/Webpack — build, Makefile, CI all on Vite/Vitest#6876
graphite-app[bot] merged 1 commit intomainfrom
04-21-feat_fr-2611_retire_craco_webpack_build_makefile_ci_all_on_vite_vitest

nowgnuesLee commented Apr 22, 2026 •

edited

Loading

Uh oh!

nowgnuesLee commented Apr 22, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

graphite-app Bot commented Apr 30, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

nowgnuesLee commented Apr 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Build

Makefile

CI

Dep cleanup (react/package.json)

Verification

Stack

Uh oh!

nowgnuesLee commented Apr 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

How to use the Graphite Merge Queue

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

graphite-app Bot commented Apr 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Merge activity

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

nowgnuesLee commented Apr 22, 2026 •

edited

Loading

Dep cleanup (`react/package.json`)

nowgnuesLee commented Apr 22, 2026 •

edited

Loading

graphite-app Bot commented Apr 30, 2026 •

edited

Loading